<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<style>
		</style>
		
		<link href="_collins_c_wrap.css" rel="stylesheet" type="text/css" />
		<link href="_LDOCE_4_wrap.css" rel="stylesheet" type="text/css"  />
		<link rel="stylesheet" href="APlayer.min.css">
		<style>
		@font-face {
		  font-family: "kpp";
		  src: url(_kpp.ttf) format('truetype');
		}
		
		.kpp{
		  font-family: kpp!important;
		}
		/*
		ODH Template
		author:ninja huang
		site:https://github.com/ninja33/odh
		*/
		a{
			text-decoration: none;
			color: black;
		}
		
		.card {
		  margin: 12px;
		  text-align: left;
		  background-color: #fff;
		  background-image: url(_clean_green.jpg); 
		  background-attachment: fixed;
		}
		
		.section {
		  color: #414141;
		  background-color: #fefefe;
		  font-family:"Segoe UI", Arial, "Microsoft Yahei", sans-serif!important;
		  font-size: 16px!important;
		  box-shadow: 1px 1px 5px 0px rgba(0, 0, 0, 0.3),0 0px 0px 1px rgba(0, 0, 0, 0.1);
		  border-radius: 5px;
		  margin: 8px 0;
		}
		
		
		.items{
		  margin: 0 12px;
		  padding: 10px 0;
		  line-height: 1.5em;
		}
		
		.items a{
		 
		}
		
		#audio{
		  margin-left: 5px;
		}
		
		#audio img{
		  width: 64px;
		  height: 64px;
		}
		
		hr{
		  border        : 1px;
		  margin        : 5px 0;    
		  border-top : 1px solid #d5d5d5; 
		}
		
		#front, 
		#back{
		  line-height: 1.4em;
		}
		
		#front{
		  text-align: left;
		  vertical-align:middle;
		}
		
		#expression{
		  font-size: 1.4em;
		  font-weight: bold;
		}
		
		#reading{
		  font-weight:normal;
		  margin:0 5px;
		  font-size: 0.8em
		}
		
		#note{
		}
		
		#back{
		}
		
		
		#front-extra2{
		}
		#back-extra1{
		}
		#back-extra1{
		}
		
		/*general css style for manual card*/
		div u:first-child{
		  text-decoration:none;
		  font-size:0.9em; 
		  margin-right:5px; 
		  padding:2px 4px; 
		  color:white; 
		  background-color:#0d47a1; 
		  border-radius:3px;
		}
		
		div i:first-child{
		  font-style:normal;
		  display:block;
		  margin:5px 0;
		  padding:5px;
		  background:rgba(13,71,161,0.1); 
		  border-radius:5px;
		  font-size:0.9em;
		}
		
		
		/*special fomat for Collins*/
		._collins_c .explanation_item ul:empty{
		  margin:0;
		  padding:0;
		}
		
		/*special fomat for ODH*/
		.odh-playsound {
		  vertical-align: text-bottom;
		  margin: 0 3px;
		}
		
		.chn_tran{
		  display:initial; 
		  /*display:none; */
		}
		
		.chn_sent{
		  display:initial; 
		  /*display:none; */
		}
		
		/*special fomat for LDOCE4*/
		.L_ENT,
		.L_ENT+br{
		  display:none
		}
		.L_NOT{
		  margin-right:5px;
		  border-radius:50%;
		  padding:1px 2px;
		}
		
		.L_NOT,
		.L_SYL,
		.L_NOT+br{
		  display:none
		}
		
		.L_POS{
		  font-weight:normal!important;
		  border-radius:3px;
		  padding:2px 4px!important;
		  margin: 0 5px 0 0!important;
		  background-color:#0d47a1!important;
		}
		
		.L_DEC{
		  display:inline!important;
		  margin-left:5px!important;
		}
		
		.L_SYN{
		  color:navy!important;
		  border-color:navy!important;
		  margin-right:5px!important;
		}
		
		.L_REG,
		.L_SYN,
		.L_REF{
		  font-weight:normal!important
		}
		.L_EX{
		  margin:3px 0!important;
		  border:initial!important;
		  padding:5px!important;
		  background:rgba(13,71,161,0.1)!important; 
		  border-radius:5px;
		  font-size:0.9em;
		}
		
		.L_RND{
		  display:none;
		}
		.L_CEX{
		  color:navy!important;
		  margin-left:initial!important;
		}
		font[color="black"]{
		  display:none;
		}
		
		.L_HR1,
		.L_HR2,
		.L_HR3{
		  height:initial!important;
		  border: 1px!important;
		  margin: 8px 0!important;    
		  border-top : 1px solid #d5d5d5!important; 
		}
		
		.hidden{
		  display:none!important;
		}
		</style>
		
		<script>
	
		
		
			function getTerminalType() {
					function BrowserVersionType() {
						var u = navigator.userAgent,
							app = navigator.appVersion;
						return { //移动终端浏览器版本信息 
							ios: !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/), //ios终端 
							android: u.indexOf('Android') > -1 || u.indexOf('Linux') > -1, //android终端或uc浏览器 
							iPhone: u.indexOf('iPhone') > -1, //是否为iPhone或者QQHD浏览器 
							iPad: u.indexOf('iPad') > -1, //是否iPad 
							win: u.indexOf('QtWebEngine') > -1,
						}
					}
		
					versions = BrowserVersionType();
					//console.log(JSON.stringify(versions));
					var tempCode;
					if(versions.iPhone || versions.iPad || versions.ios) {
						tempCode = 0;
					} else if(versions.android) {
						tempCode = 1;
					} else if(versions.win) {
						tempCode = 2;
					} else {
						tempCode = 2;
						isDebug = true;
					}
					//返回终端类型
					return tempCode;
				}
		
		function playAudio(wordID) {
		    var word = document.getElementById(wordID).innerText;
		    var audioSrc =word;
		    //检查是否为电脑端
		    if(typeof(py)=="object"){
		    //如果是电脑端，需安装插件 #498789867(replay button on card)才能发音
		        py.link("ankiplay"+audioSrc)
		    }else{
		        var player=document.getElementById('player')
		        player.src=audioSrc
		        player.play()
		    }
		}
		</script>
		
		<style>
		</style>
		
	</head>
	<body>
		<div class="section">
<div  class="items">
<div id="aplayer"></div>
</div>

</div>
<span id="audio_text" style="display: none;">http://oss.kind.pub/english/audio/2021%E5%B9%B46%E6%9C%88%E8%8B%B1%E8%AF%AD%E5%9B%9B%E7%BA%A7%E5%90%AC%E5%8A%9B%E7%9C%9F%E9%A2%98%20%E7%9F%AD%E6%96%87%283%29_76530.0_83490.0.mp3</span>

<script src="APlayer.min.js"></script>
<script>
const ap = new APlayer({
		        container: document.getElementById('aplayer'),
		        audio: [{
		            name: '四级',
		    		loop:'one',
		    		artist: ' ',
		    		autoplay:'true',
		            url:document.getElementById('audio_text').innerText,
		            cover: 'english_book.png'
		        }]
		    });
</script>

	</body>
</html>
